.el-mask {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  z-index: 99998;
  position: fixed;
  background-color: @shadow;
}

.el-modal-wrapper {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  outline: 0;
  width: 100%;
  z-index: 99998;
  overflow: auto;
  position: fixed;
  -webkit-overflow-scrolling: touch;
  .el-modal {
    top: 100px;
    top: 15vh;
    width: 480px;
    margin: 0 auto;
    position: relative;
    .el-modal-content {
      margin: auto;
      position: relative;
      background-color: #fff;
      border-radius: @borderRadio;
      padding: 1.1538rem 1.1538rem 0.7692rem;
      box-shadow: 0 2px 0.6153rem @shadow;
      -webkit-box-shadow: 0 2px 0.6153rem @shadow;
      .el-modal-close {
        top: 0.7692rem;
        z-index: 1;
        right: 1rem;
        cursor: pointer;
        width: 1.5384rem;
        height: 1.5384rem;
        font-size: 1.1538rem;
        text-align: center;
        position: absolute;
        color: @lightText;
        &:hover {
          color: @d_primary;
        }
      }
      .el-modal-header {
        width: 100%;
        font-weight: 700;
        padding-bottom: 0.7692rem;
        font-size: 1.1538rem;
        border-bottom: 1px solid @border;
      }
      .el-modal-body {
        min-height: 150px;
        padding-top: 0.7692rem;
        padding-bottom: 0.7692rem;
      }
      .el-modal-footer {
        text-align: right;
        padding-top: 0.7692rem;
        border-top: 1px solid @border;
      }
    }
    &.el-large {
      width: 560px;
      .el-modal-content {
        padding: 1.5384rem;
        font-size: 1.2307rem;
        .el-modal-header {
          font-size: 1.3846rem;
        }
      }
    }
    &.el-small {
      width: 360px;
      .el-modal-content {
        padding: 0.7692rem;
        font-size: 0.9230rem;
        .el-modal-header {
          font-size: 1.0769rem;
        }
      }
    }
  }
}